<template>
	<view>
		<view style="padding: 20rpx;background-color: #f2f2f2">
		
			<u-grid :col="3">
				<u-grid-item>
					<view>{{balanceInfo.balance}}</view>
					<view class="grid-text">总余额</view>
				</u-grid-item>
				<u-grid-item>
					<view>{{balanceInfo.frozen_balance}}</view>
					<view class="grid-text">待结算</view>
				</u-grid-item>
				<u-grid-item>
					<view>{{balanceInfo.cash}}</view>
					<view class="grid-text">可提现</view>
				</u-grid-item>
			</u-grid>
			
		</view>

		<view class="fee-desc m-top-20 font-size-9">
			<view class="title">费用说明</view>
			<view class="fee">
				<view class="handling-fee">
					<view class="sum" :style="{color:'#FF7104'}">
						<text>￥1.00</text>
					</view>
					<view class="desc">提现手续费</view>
				</view>
			</view>
		</view>
		
		<view class="text-input-desc m-top-20">
			<view class="money">
				<view class="dot font-size-16">¥</view>
				<input class="input font-size-12" type="number" v-model="money" maxlength="20"
					placeholder-style="color:#BFBFBF" :placeholder="`最高可提现${balanceInfo.cash}元`" />
				<view class="text font-size-9" @click="checkAll" :style="{color:'#FF7104'}">全部提现</view>
			</view>
			<view class="sum font-size-9 m-top-20">
				预计到账：
				<span class="red" :style="{color:'#FF7104'}">{{ money > 1 ? (money-1).toFixed(2) : `？` }}元</span>
			</view>
		</view>


		<view style="background-color: #fff;padding-top: 40rpx;">
			<view class="withdrawal-sure">
				<button type="default" @click='deposit'>确认提现</button>
			</view>
			<view @click="openUrl('/pages/hxt/cashDetail')" style="text-align: center;margin-top: 40rpx;font-size: 10pt;color:#ff7104;text-decoration: underline;">提现记录</view>
		</view>
		

		<com-payment-password ref="paymentPassword" :value="paymentPwd" :digits="6" @cancel="closePwdHandler" @checkSafePwd="safePasswork"></com-payment-password>
		
	</view>
</template>

<script>
	import jxListCell from '@/components/list-cell/list-cell';
	export default {
		components: {
			jxListCell,
			// passkeyborad
		},
		data() {
			return {
				type:"user",
				balanceInfo:{
					balance:0,
					frozen_balance:0,
					cash:0,
					is_pwd_set: 0
				},
				information: '',
				money: '', //金额
				paymentPwd:"",
			};
		},
		onLoad(opt){
			this.type = opt.type ?? 1;
		},
		onShow() {
			this.balanceQuery();
		},

		methods: {
			openUrl(url) {
				uni.navigateTo({url})
			},
			async balanceQuery(){
				let self = this;
				let data = {app_type:self.type};
				let res = await self.$http.request({url:self.$api.hxt.queryBalance,showLoading: true,data})
				if(res.code != 0){
					self.$http.toast(res.msg);
					return;
				}
				self.balanceInfo.is_pwd_set = res.data.is_pwd_set;
				self.balanceInfo.balance = (parseInt(res.data.balance) / 100).toFixed(2);
				self.balanceInfo.frozen_balance = (parseInt(res.data.frozen_balance) / 100).toFixed(2);
				self.balanceInfo.cash = (self.balanceInfo.balance - self.balanceInfo.frozen_balance).toFixed(2);
			},
			
			checkAll() { //全部提现
				this.money = String(this.balanceInfo.cash)
			},
			
			
			link() { //跳到流水明细页面
				uni.navigateTo({
					url:'/pages/hxt/cashDetail?app_type='+this.type
				})
			},

			closePwdHandler(){
				this.paymentPwd = '';
			},
			
			async safePasswork(e){
				let self = this;
				let withdraw_pwd = e.passwork;
				let data = {money:self.money,withdraw_pwd};
				let res = await self.$http.request({
					url:self.$api.hxt.enchashment,
					method: 'POST',
					showLoading: true,
					data:{money:self.money,withdraw_pwd}
				});
				self.$refs.paymentPassword.modalFun('hide');
				self.paymentPwd = '';
				if(res.code !== 0){	
					return self.$http.toast(res.msg);
				}
				self.$http.toast('操作成功！');
				setTimeout(function() {
					uni.navigateTo({url: '/mch/personalCentre/withdrawal/withdrawal_detail'})
				}, 1500)
			},
			
			async deposit() { //确认提现
				var that = this
				let money = parseFloat(that.money);
				if(money < 10){
					return that.$http.toast('单次提现金额不能低于10元');
				}
				if(money > that.balanceInfo.cash){
					return that.$http.toast('恒信通账户余额不足~');
				}
				let res = await this.$http.request({
					url:this.$api.hxt.hxtAccountInfo,
					method:'POST',
					showLoading:true
				});
				if(res.code !== 0 || res.data.status !== 1){
					uni.showModal({
						title:'温馨提示',
						content:'您的恒信通账户还未激活，请先激活账户再进行提现。是否立即前往？',
						confirmText:'前往激活',
						cancelText:'稍后前往',
						success(res){
							if (res.confirm) {
								uni.navigateTo({url:'/pages/hxt/index'});
							} 
						}
					})
					return ;
				}
				
				if (that.balanceInfo.is_pwd_set == 0) {
					uni.showModal({
						title:'温馨提示',
						content:'您还没有设置支付密码,请先设置支付密码，是否前往？',
						confirmText:'立即前往',
						cancelText:'稍后前往',
						success(res){
							if (res.confirm) {
								uni.navigateTo({url:'/pages/user/payment/password'});
							} 
						}
					})
					return ;
				} else {
					// 调用弹出函数
					that.$refs.paymentPassword.modalFun('show');
				}
			}
		},
	}
</script>

<style lang="less">
	.text-input-desc,
	.fee-desc,
	.withdraw-type {
		background-color: #ffffff;
	}
	
	.text-input-desc {
		padding: 20rpx 30rpx;
		display: flex;
		flex-direction: column;
	
		.money {
			display: flex;
			align-items: center;
			padding: 30rpx 0;
			border-bottom: 1rpx solid #f2f2f2;
	
			.dot {
				margin-right: 20rpx;
				font-weight: 600;
			}
	
			.input {
				flex: 1;
				border-bottom: 0;
			}
	
			.text {
				color: #bc0100;
				font-weight: 600;
			}
		}
	
		.sum {
			color: #333333;
	
			.red {
				color: #bc0100;
			}
		}
	}
	
	.fee-desc {
		.fee {
			display: flex;
			padding: 10rpx 0;
	
			.handling-fee,
			.labor-service-fee {
				height: 170rpx;
				flex: 1;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
			}
	
			.sum,
			.desc {
				line-height: 40rpx;
			}
	
			.sum {
				color: #bc0100;
				font-weight: 600;
				font-size: 11pt;
				margin-bottom: 8rpx;
			}
		}
	}
	
	.title {
		padding: 0 30rpx;
		line-height: 60rpx;
		border-bottom: 1rpx solid #f2f2f2;
	}
	
	
	.withdrawal-sure {
		width: 80%;
		height: 80rpx;
		background:#FF7104;
		margin: 0 auto;
		border-radius: 10rpx;
	}
	
	.withdrawal-sure button {
		width: 100%;
		height: 100%;
		outline: none;
		border: none;
		background:#FF7104;
		line-height: 80rpx;
		text-align: center;
		color: #fff;
	}
	
	
</style>
